<template>
    <div>
        <el-tabs :value="activeName" @tab-click="tabClick">
            <el-tab-pane
                :key="item.name"
                v-for="item in tabs"
                :label="item.label"
                :name="item.name"
            >
                <!--  <component :is=item.content></component> -->
            </el-tab-pane>
        </el-tabs>
    </div>
</template>
<script>
import routerJson from '@/router/router-json.js'
export default {
    data() {
        return {
            // activeName: this.$route.name
        };
    },
    computed: {
        activeName() {
            return this.$route.name
        },
    },
    methods: {
        tabClick(tab, event) {
            // if (!routerJson[tab.name]) {
            //     this.$router.push('/404');
            //     return
            // }
            if(this.$route.name == tab.name) return;
            this.$router.push({ name: tab.name });
            if (this.handleClick) {
                this.handleClick(tab, event);
            }
        }
    },
    mounted() { 
        // console.log('===========>>>mounted', this.$parent) 
    },
    props: ["tabs", "handleClick"]
};
</script> 
<style>
</style>